<!DOCTYPE html>
<html>

{include file='public/header'}

<body>
    <div class="x-nav">
        <span class="layui-breadcrumb">
            <a href="javascript:void(0)">首页</a>
            <a href="javascript:void(0)">用户管理</a>
            <a><cite>角色管理</cite></a>
        </span>
        <a class="layui-btn layui-btn-small" id="reload" title="刷新">
            <i class="layui-icon" style="line-height:30px"><i class="iconfont">&#xe6aa;</i></i>
        </a>
    </div>
    <div class="x-body">
        <table id="rule" lay-filter="rule"></table>
    </div>
    <script type="text/html" id="toolbarDemo">
        <div class="layui-btn-container">
            <button class="layui-btn layui-btn-sm" lay-event="add">新增</button>
        </div>
    </script>
    <script type="text/html" id="download_atNumTpl">
    <a class="layui-btn layui-btn-primary layui-btn-xs layui-table-link" lay-event="look_a">{{
        d.download_at? dayjsFormat(d.download_at):'' }}{{d.downloadname}}</a>
</script>
<script type="text/html" id="tbBar">
        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>
    <script>
        var menuAll;
        Ajax('/admin/menu/all', {}, 'get').then(data => {
            menuAll = data.data
        }).then(() => {
            let params = {
                elem: '#rule'
                , toolbar: '#toolbarDemo'
                , url: '{:url("admin/rule/list")}' //数据接口
                , id: 'rule'
                , page:true//开启分页
                , cols: [[ //表头
                    { field: 'id', title: 'ID', width: 80, sort: true }
                    , { field: 'name',width:200, title: '角色名称', }
                    , {
                        field: 'menu_ids', title: '角色权限', templet: function (d) {
                            let jurisdiction = []
                            menuAll.forEach(item => {
                                d.menu_ids.forEach(v => {
                                    if (item.id == v) {
                                        jurisdiction.push(item.name)
                                    }
                                })
                            })
                            return jurisdiction.toString()
                        }
                    }
                    , { toolbar: '#tbBar', title: '操作', width: 150 }
                ]]
            }
            tableList(params)

            layui.use('table', function () {
                var table = layui.table;
                table.on('toolbar(rule)', function (obj) {
                    var event = obj.event;
                    if (event === 'add') {
                        x_admin_show('添加角色', './info.html', 1050, 550);
                    }
                });
                table.on('tool(rule)', function (obj) {
                    var event = obj.event;
                    if (event === 'del') {
                        tableAjax('/admin/rule/delete',{ id: obj.data.id },'rule')
                    } else if (event === 'edit') {
                        x_admin_show('编辑角色', `./info.html?id=${obj.data.id}&menu_ids=${obj.data.menu_ids}`, 1050, 550);
                    }else if (event === 'look_a') {
                        x_admin_show('下载记录', `/admin/actionlog/index.html?video_id=${obj.data.id}`, 1150, 650);
                    }
                });

            });
        })


    </script>
</body>

</html>